<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>vue+axios</title>
    <script src="js/axios.js"></script>
    <script src="js/qs.js"></script>
</head>

<body>
    <script>
        // 基础配置
        const req = axios.create({
            baseURL: "http://127.0.0.1",
            withCredentials: true,
            timeout: 3600,
            headers: {
                "Content-Type": "application/json;charset=UTF-8"
            }
        });

        // 参数
        const param = {
            page: 1,
            size: 10,
            ids: [1, 2, 3, 4],
            name: "花花世界不必认真",
            time: "2023-09-22"
        }

        // 请求：POST
        // post();
        function post() {
            req({
                method: 'POST',
                url: "/demo/login",
                data: param
            }).then(res => {
                console.log(res.data);
            }).catch(err => {
                console.error(err.response.data);
            })
        }


        // 请求：GET、PUT、DELETE
        // gpd();
        function gpd() {
            req({
                method: 'DELETE',
                url: "/demo/delete",
                params: param,
                paramsSerializer: params => Qs.stringify(params) // 处理数组参数
            }).then(res => {
                console.log(res.data);
            }).catch(err => {
                console.error(err.response.data);
            })
        }

        // 同步异步：async+await
        // async 声明一个方法是异步的
        // await 等待一个异步方法执行完成
        // test();
        var name = [];
        async function test() {
            name = await req({
                method: 'POST',
                url: "/demo/post",
                data: param
            }).then(res => {
                return res.data.name;
            }).catch(err => {
                console.error(err.response.data);
            })
            console.log('>>>', name);
        }

    </script>
</body>

</html>